<template>
    <div class="static-task">
        <el-row class="header" type="flex" justify="space-between">
            <span class="header-title">{{ title }}</span>
            <div>
                <el-button v-if="superior > 0" size="small" icon="el-icon-upload" @click="handPushReport">推送上报</el-button>
                <el-tooltip placement="top">
                    <div slot="content">导出统计结果</div>
                    <el-button :loading="downloading" :disabled="downloading" type="primary" size="small" icon="el-icon-download" @click="handExport">{{ downloading ? '下载中' : '导出' }}</el-button>
                </el-tooltip>
            </div>
        </el-row>
        <!-- 任务统计面板 -->
        <dash-board
            :dimension="monitorInfo"
        />
        
        <TableInfo v-if="isTable" :taskId="taskid" :statics="true" :isInput="false" @isDataNull="handIsDataNull" @setResultUUID="getUUIDs"></TableInfo>
        <statics-file ref="staticsFile" v-else-if="type === '文件上传'" :targetId="taskid" @completFunc="handCompletFunc" @isDataNull="handIsDataNull"></statics-file>
        <statics-question v-else-if="type === '测评问卷'" :targetId="taskid" @isDataNull="handIsDataNull" @setResultUUID="getQuestionUUIDs"></statics-question>
        <custom-table
            v-else-if="type === '通知'"
            :dataSource="tableRecords"
            ref="noticeTable"
        />
    </div>
</template>
<script>
import { getExportTable } from "@/api/workflow.js";
import { postPushReport, getTaskProcessMonitor } from "@/api/work.js";
import { mapGetters } from 'vuex'
import Cookies from 'js-cookie'
export default {
    name: 'staticTask',
    components: {
      'TableInfo': require('../showRecord/components/TableInfo.vue').default,
      'StaticsFile': require('./components/StaticsFile.vue').default,
      'StaticsQuestion': require('./components/StaticsQuestion.vue').default,
        DashBoard: () => import('./components/DashBoard.vue'),
        CustomTable: () => import('./components/CustomTable.vue'),
    },
    computed: {
      ...mapGetters([
        'id'
      ]),
        isTable(){
            return this.type.indexOf('填报') > -1
        }
    },
    data(){
        return{
            taskid: null,
            type: '',
            downloading: false,
            isDataNull: false,
            tableReportUUIDs: [],
            questionReportUUIDs: [],
            title: '',
            monitorInfo:{},
            tableRecords:[],
            superior: 0
        }
    },
    created() {
      const params = this.$route.query
      this.taskid = params.targetId + ''
      this.type = params.type
      this.title = params.title
      this.superior = params.superior
      this.fetchProcessMointor()
    },
    methods:{
        // 查询任务进度监控信息
        fetchProcessMointor(){
            getTaskProcessMonitor(this.taskid, this.id).then(res =>{
                const { record, result } = res.data
                this.monitorInfo = result
                // 如果数量为奇数，自动添加空值
                if(Object.keys(result).length % 2) {
                    this.monitorInfo = {...result, '': ''}
                }
                this.tableRecords = record
            })
        },
        // 表格填报统计uuid数组
        getUUIDs(data){
            const res = []
            data.forEach(e =>{
                res.push(e.replace("\"","").replace("\"",""))
            })
            this.tableReportUUIDs = res
        },
        // 问卷填报统计uuid数组
        getQuestionUUIDs(data){
            this.questionReportUUIDs = data.map(e => e['uuid'])
        },
        // 判断数据是否为空
        handIsDataNull(flag){
            this.isDataNull = flag
        },
        // 导出zip完成回调
        handCompletFunc(falg){
            this.downloading = false
            if(!falg){
                this.$notify.error({
                    title: '提示',
                    message: '导出操作失败'
                })
            }
        },
        // 推送上报
        handPushReport(){
            if(this.isDataNull){
                this.$message.warning('暂无数据可以推送上报,请先填写数据')
                return
            }
            const param ={
                userid: this.id,
                taskid: this.taskid,
                type: this.type 
            }
            if(this.type === '表格填报'){
                param.uuid = this.tableReportUUIDs
            }else if(this.type === '测评问卷'){
                param.uuid = this.questionReportUUIDs
            }
            this.$confirm('此操作将推送上报数据到上级部门, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                postPushReport(param).then(res =>{
                    if(res && res.data && res.data.status === 200){
                        this.$notify.success({
                            title: '提示',
                            message: '数据推送上报成功'
                        })
                    }else{
                        this.$notify.error({
                            title: '提示',
                            message: '数据推送上报失败'
                        })
                    }
                })
            })
        },
        // 导出
        handExport(){
            if(this.isDataNull){
                this.$message.warning('暂无数据可以导出')
                return
            }
            this.downloading = true
            if(this.type === '文件上传'){
                this.$refs.staticsFile.downloadZip(this.title)
            }else if(this.type === '通知'){
                this.$refs.noticeTable.handleExportExcel(this.title)
            }else if(this.type === '表格填报' || this.type === '测评问卷'){
                const token = Cookies.get('token')
                window.open(`${process.env.VUE_APP_WORKFLOW_URL}/workflow/excel/exporte?taskId=${this.taskid}&sessionid=${token}&type=${this.type}`, '_self')
                this.downloading = false

                // const param ={
                //     taskId: this.taskid,
                //     sessionid: Cookies.get('token')
                // }
                // getExportTable(param).then(res =>{
                    
                // })
                // .catch(e =>{
                //     this.$notify.error({
                //         title: '提示',
                //         message: '文件导出失败'
                //     })
                // })
            }
            this.downloading = false
        }
    }

}
</script>
<style lang="scss">
.static-task{
    padding: 20px;
    .header{
        padding-bottom: 10px;
        border-bottom:1px solid #ddd;
        font-size: 18px;
        font-weight: 600;
        line-height: 2;
        align-items: baseline;
      }
      .amount-desc{
        margin-bottom: 10px;
        box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
      }
      .demo-table-expand {
     font-size: 0; 
    padding: 10px 0 0;
  }
  .demo-table-expand label {
    width: 70px;
    color: #99a9bf;
  }
  .demo-table-expand .el-form-item {
    margin-right: 0;
    margin-bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40%;
    .el-form-item__content{
        line-height: 22px;
    }
  }
  .demo-table-expand .el-form-item:last-child(){
    padding-left: 32px;
  }
  
}
</style>